<template>
  <HModal
    :model-value="assignDialog"
    :title="isAdd ? '新增服务人员' : '修改服务人员信息'"
    @close="onCancel"
    :width="550"
  >
    <div
      v-loading="saveLoading || getNetworkDetailEmpListDetailLoading || delLoading"
      element-loading-text="加载中..."
    >
      <el-form
        ref="formRef"
        label-width="72"
        :model="networkEmpVo"
        :rules="rulesForm"
        @validate="handleFormValidate"
        class="modal_form_content"
      >
        <!-- 手机号码 -->
        <el-form-item
          :rules="[{ validator: phone(networkEmpVo.accountUserPhone), trigger: 'blur' }]"
          label="手机号码"
          prop="accountUserPhone"
          :class="{
            error_form_item: !formValidateResult['accountUserPhone'],
            form_input_item: true,
          }"
        >
          <div class="find_user_container">
            <el-input
              v-model="networkEmpVo.accountUserPhone"
              clearable
              maxlength="11"
              style="height: 28px"
              @keyup="handlePhoneInput"
              placeholder="请输入手机号码"
            />
            <HPlainButton
              :loading="queryAccountInfoLoading"
              @click="findBtn(networkEmpVo.accountUserPhone)"
              >查询
            </HPlainButton>
          </div>
        </el-form-item>

        <!-- 姓名 -->
        <el-form-item
          label="人员姓名"
          prop="accountUserName"
          :class="{
            form_input_item: true,
            error_form_item: !formValidateResult['accountUserName'],
          }"
        >
          <el-input v-model="networkEmpVo.accountUserName" clearable placeholder="请输入姓名" />
        </el-form-item>

        <!-- 在职状态 -->
        <el-form-item label="在职状态" class="form_radio_group_item">
          <el-radio-group v-model="networkEmpVo.quit">
            <el-radio :value="false">在职</el-radio>
            <el-radio :value="true">离职</el-radio>
          </el-radio-group>
        </el-form-item>

        <!-- 角色管理 -->
        <el-form-item label="角色管理" class="form_radio_group_item">
          <el-radio-group v-model="networkEmpVo.superManager">
            <el-radio :value="false">工程师</el-radio>
            <el-radio :value="true">管理员</el-radio>
          </el-radio-group>
        </el-form-item>

        <!-- 结单策略 -->
        <el-form-item label="接单策略" class="form_radio_group_item">
          <el-radio-group v-if="teamType == 2" :disabled="teamType == 2" :model-value="true">
            <el-radio :value="false">手动确认</el-radio>
            <el-radio :value="true">自动确认</el-radio>
          </el-radio-group>
          <el-radio-group
            v-else
            :disabled="teamType == 2"
            v-model="networkEmpVo.autoSureReceiveOrder"
          >
            <el-radio :value="false">手动确认</el-radio>
            <el-radio :value="true">自动确认</el-radio>
          </el-radio-group>
        </el-form-item>

        <!-- 工程师等级 -->
        <el-form-item label="工程师等级" class="form_select_item">
          <div style="width: 100%; display: flex; align-items: center">
            <el-select
              style="width: 11.8rem; margin-right: 0.5rem"
              v-model="networkEmpVo.networkEmpLevelId"
              :filter-method="getNetworkEmpPageSelectList"
              class="input_w"
              clearable
              filterable
              placeholder="工程师等级"
              :loading="getNetworkEmpPageSelectListLoading"
              remote-show-suffix
              :disabled="!networkEmpVo.manualLevel"
            >
              <!-- 该选项是为了解决无关键字时搜索会不显示无数据面板 -->
              <el-option v-if="networkEmpLevelList.length <= 0" value="" disabled>
                <div style="text-align: center">暂无选项可供选择</div>
              </el-option>
              <el-option
                v-for="item in networkEmpLevelList"
                :key="item.name"
                :label="item.name"
                :value="item.id"
              />
            </el-select>
            <el-radio-group @change="radiodian" v-model="networkEmpVo.manualLevel">
              <el-radio :label="true">手动更改</el-radio>
              <el-radio :label="false">自动更改</el-radio>
            </el-radio-group>
          </div>
        </el-form-item>

        <!-- 工程师技能 -->
        <el-form-item label="工程师技能" class="form_select_item">
          <el-select
            v-model="networkEmpVo.networkEmpSkillIds"
            :filter-method="getNetworkSkillPageSelectList"
            class="input_w select_multiple"
            clearable
            filterable
            multiple
            placeholder="工程师技能"
            remote-show-suffix
            :loading="getNetworkSkillPageSelectListLoading"
          >
            <!-- 该选项是为了解决无关键字时搜索会不显示无数据面板 -->
            <el-option v-if="networkEmpSkillList.length <= 0" value="" disabled>
              <div style="text-align: center">暂无选项可供选择</div>
            </el-option>
            <el-option
              v-for="item in networkEmpSkillList"
              :key="item.name"
              :label="item.name"
              :value="item.id"
            />
          </el-select>
        </el-form-item>

        <!-- <div class="defined_sty" v-if="networkEmpVo.fieldVals.length > 0"> -->
        <!-- <template v-for="(item, bigindex) in networkEmpVo.fieldVals" :key="bigindex"> -->
        <!-- <el-form-item
              :label="item.name"
              :prop="`fieldVals[${bigindex}][${
                item.type === 5 || item.type === 6 || item.type === 7 ? 'imgarr' : 'value'
              }]`"
              :required="item.required"
              :rules="[{ required: item.required, message: item.tip, trigger: ['blur', 'change'] }]"
              class="form_item"
              :class="{ radio_form_item: item.type === 3 }"
            > -->
        <!-- 文本1 -->
        <!-- <el-input
                v-if="item.type === 1"
                v-model="item.value"
                :placeholder="item.tip"
                class="input_w"
                clearable
                type="text"
              /> -->

        <!-- 多行文本2 -->
        <!-- <el-input
                v-if="item.type === 2"
                v-model="item.value"
                :placeholder="item.tip"
                :rows="1"
                class="input_w"
                maxlength="500"
                show-word-limit
                type="textarea"
              /> -->

        <!-- 单选3 -->
        <!-- <el-select
                v-if="item.type === 3 && item.contents?.length > 3 && item.type == 3"
                v-model="item.value"
                :placeholder="item.tip"
                class="input_w"
                clearable
              >
                <el-option v-for="i in item.contents" :key="i.id" :label="i.val" :value="i.val" />
              </el-select> -->

        <!-- <el-radio-group v-else-if="item.type === 3 && item.type == 3" v-model="item.value">
                <div class="radio_container">
                  <el-radio v-for="i in item.contents" :key="i.val" :value="i.val">
                    {{ i.val }}
                  </el-radio>
                </div>
              </el-radio-group> -->

        <!-- 多选4 -->
        <!-- <el-select
                v-if="item.type === 4 && item.contents?.length > 3"
                v-model="item.value"
                :placeholder="item.tip"
                class="input_w"
                clearable
                collapse-tags
                collapse-tags-tooltip
                multiple
              >
                <el-option v-for="i in item.contents" :key="i.id" :label="i.val" :value="i.val" />
              </el-select> -->

        <!-- <el-checkbox-group v-else-if="item.type === 4" v-model="item.value" class="input_w">
                <el-checkbox v-for="i in item.contents" :key="i.id" :value="i.val">
                  {{ i.val }}
                </el-checkbox>
              </el-checkbox-group> -->

        <!-- 图片567 -->
        <!-- <div v-if="item.type === 5 || item.type === 6 || item.type === 7" class="upload_file">
                <el-upload
                  v-model="item.imgarr"
                  :accept="item.type == 5 ? 'image/*' : item.type == 6 ? '.pdf' : 'video/*'"
                  :auto-upload="false"
                  :on-change="
                    () => {
                      handleChange2(file, item)
                    }
                  "
                  :show-file-list="false"
                  action="#"
                  drag
                  multiple
                >
                  <el-icon class="up_icon" size="32" color="#000">
                    <upload-filled />
                  </el-icon>
                  <div style="line-height: 14px; height: 14px; color: #000">
                    点击上传{{ item.type == 5 ? '图片' : item.type == 6 ? 'pdf格式文件' : '视频' }}
                  </div>
                </el-upload>
                <ul class="ul_list">
                  <li v-for="(it, index) in item.imgarr" :key="index" class="li_item">
                    <div class="li_item_left">
                      <img
                        v-if="
                          it.name
                            ? it.name.replace(/.+\./, '') == 'pdf'
                            : it.image.replace(/.+\./, '') == 'pdf'
                        "
                        :src="pdf"
                        alt=""
                        style="width: 30px; height: 30px; cursor: pointer"
                        @click.stop="lookFile(it.image, 'pdf')"
                      />
                      <el-icon
                        v-else-if="
                          right_type.includes(
                            it.name ? it.name.replace(/.+\./, '') : it.image.replace(/.+\./, ''),
                          )
                        "
                        size="30"
                        style="cursor: pointer"
                        @click.stop="lookFile(it.image, 'film')"
                      >
                        <Film />
                      </el-icon>
                      <el-image
                        v-else
                        :preview-src-list="[it.image]"
                        :src="it.image"
                        fit="contain"
                        style="width: 30px; height: 30px"
                      />
                      <el-tooltip effect="dark" placement="top">
                        <template #content>
                          {{
                            it.name
                              ? it.name
                              : it.image?.substring(
                                  it.image.lastIndexOf('/') + 1,
                                  it.image.lastIndexOf('_'),
                                ) + it.image?.substring(it.image.lastIndexOf('.'))
                          }}
                        </template>
                        <span class="pic_name">{{
                          it.name
                            ? it.name
                            : it.image?.substring(
                                it.image.lastIndexOf('/') + 1,
                                it.image.lastIndexOf('_'),
                              ) + it.image?.substring(it.image.lastIndexOf('.'))
                        }}</span>
                      </el-tooltip>
                    </div>
                    <el-icon class="del_btn" size="16" @click.stop="deleteItem2(bigindex, index)">
                      <Delete />
                    </el-icon>
                  </li>
                </ul>
              </div> -->
        <!-- </el-form-item> -->
        <!-- </template> -->
        <!-- </div> -->
      </el-form>
    </div>

    <template #footerLeft>
      <HPlainBgButton is-modal v-if="!isAdd" type="error" @click="btnDelete"> 删除 </HPlainBgButton>
    </template>

    <template #footerRight>
      <HButton is-modal type="primary" @click="onSave">保存</HButton>
      <HButton is-modal @click="onCancel">取消</HButton>
    </template>
  </HModal>

  <!-- 文件查看 -->
  <HModal v-model="dialogContract" :title="isPdf == 'pdf' ? '查看附件' : '查看视频'">
    <iframe v-if="isPdf == 'pdf'" :src="`${file}`" height="700" width="100%"></iframe>
    <video v-else :src="`${file}`" autoplay controls style="width: 100%"></video>
  </HModal>
</template>

<script lang="ts" setup>
  import { PropType, ref, toRefs, watch } from 'vue'
  import type { UploadFile } from 'element-plus'
  import { ElMessage, ElMessageBox } from 'element-plus'
  import pdf from '@/assets/image/pdf.png'
  import { getInfoAccount } from '@/api/organize'
  import { phone, verifyPhone } from '@/utils/validate'
  import * as _ from 'lodash'
  import { orderAnnexUpload, orderVideoUpload } from '@/api/upload'
  import {
    deleteNetworkEmp,
    empSave,
    getNetworkDetailEmpListDetail,
    getNetworkEmpLevelSelect,
    getNetworkEmpSkillSelect,
    getNetworkPageSelect,
    networkEmpFieldSelect,
  } from '@/api/network'
  import { Delete, Film, UploadFilled } from '@element-plus/icons-vue'
  import { NetworkOptions } from './types'
  import { Emp } from '../list/types'
  import useFormValidateService from '@/services/common/formValidate/useFormValidate'

  const props = defineProps({
    modelValue: Boolean,
    networkId: String || Object,
    emp: String,
    empInfo: Object as PropType<Emp | null>,
    isAdd: Boolean,
    assignDialog: Boolean,
    teamType: [String, Number],
  })

  const emits = defineEmits<{
    (e: 'assign-dialog'): void
    (e: 'update-list'): void
    (e: 'update:modelValue', value: boolean): void
  }>()

  const { handleFormValidate, resetFormValidateResult, formValidateResult } =
    useFormValidateService([
      'accountUserPhone',
      'dateType',
      'remindMode',
      'moduleIds',
      'accountUserName',
    ])

  /**
   * 手机号码输入事件
   * @param {Event} e - Event
   */
  const handlePhoneInput = (e: Event) => {
    ;(e.target as HTMLInputElement).value = (e.target as HTMLInputElement).value.replace(
      /[^\d]/g,
      '',
    )
  }

  const { empInfo, isAdd, assignDialog, teamType } = toRefs(props)
  const empRelationId = ref()
  const formRef = ref()
  var right_type = [
    'avi',
    'wmv',
    'mpg',
    'mpeg',
    'mov',
    'rm',
    'ram',
    'swf',
    'flv',
    'mp4',
    'wma',
    'rm',
    'rmvb',
    'flv',
    'mpg',
    'mkv',
  ]
  let networkEmpVo = ref({
    accountId: null, //账号ID
    accountUserName: '', //	登录用户名
    accountUserPhone: '', //登录手机号
    delNetworkIds: [], //	删除的服务商ID
    fieldVals: [
      // {
      //     "fieldId": null,
      //     "id": null,
      //     "name": "",
      //     "type": null,
      //     "value": ""
      // }
    ],
    id: null,
    networkId: '', //服务商ID
    quit: false, //	在职状态：false-在职，true-离职
    superManager: false, //管理权限：false-普通管理员，true-超级管理员
    autoSureReceiveOrder: true, //工程师自动接单策略：false-手动确认，true-自动确认,示例值(true)
    networkEmpLevelId: null, //等级ID
    networkEmpSkillIds: [], //工程师技能ID
  })
  let CurrentnetworkEmpLevelId = ref(null) //当前工程师等级
  const rulesForm = ref({
    accountUserName: [{ required: true, message: '名称', trigger: ['blur', 'change'] }],
    moduleIds: [{ required: true, message: '适用模块', trigger: ['blur', 'change'] }],
    remindMode: [{ required: true, message: '提醒方式', trigger: ['blur', 'change'] }],
    dateType: [{ required: true, message: '生效时间', trigger: ['blur', 'change'] }],
    accountUserPhone: [
      { required: true, message: '请输入手机号', trigger: ['blur', 'change'] },
      { validator: phone(networkEmpVo.value.accountUserPhone), trigger: ['blur', 'change'] },
    ],
  })
  // 获取人员详情加载状态
  const getNetworkDetailEmpListDetailLoading = ref(false)

  // 查询人员信息加载
  const queryAccountInfoLoading = ref(false)

  /**
   * 查询人员信息
   * @param {number} phone - 手机号码
   */
  async function findBtn(phone: string) {
    if (!phone) {
      ElMessage({
        showClose: true,
        message: '请输入手机号查询！',
        type: 'warning',
        offset: 200,
      })
      return
    }
    if (!verifyPhone(phone)) {
      ElMessage({
        showClose: true,
        message: '手机号码格式不正确',
        type: 'warning',
        offset: 200,
      })
      return
    }
    queryAccountInfoLoading.value = true
    const res = await getInfoAccount(phone)
    if (res.data.success) {
      if (res.data.data.id.length > 0) {
        networkEmpVo.value.accountId = res.data.data.id
        networkEmpVo.value.accountUserName = res.data.data.name
        networkEmpVo.value.accountUserPhone = res.data.data.phone
        ElMessage({
          showClose: true,
          message: '获取成功',
          type: 'success',
          offset: 200,
        })
      } else {
        networkEmpVo.value.accountUserName = ''
        networkEmpVo.value.accountId = null
        ElMessage({
          showClose: true,
          message: '获取不到，请手动输入！',
          type: 'warning',
          offset: 200,
        })
      }
    } else {
      if (res.data.isError)
        ElMessage({
          showClose: true,
          message: res.data.message,
          type: 'error',
          offset: 200,
        })
    }
    queryAccountInfoLoading.value = false
  }

  // 保存加载
  const saveLoading = ref(false)

  // 添加or修改员工信息
  async function editDialogShow(add: boolean, val: Emp | null) {
    getNetworkDetailEmpListDetailLoading.value = true
    await getNetworkPageSelectList('')
    if (!add) {
      await getNetworkSkillPageSelectList('')
      await getNetworkEmpPageSelectList('')
      empRelationId.value = val.empRealtionId
      const empDetail = await getNetworkDetailEmpListDetail(val.empRealtionId, val.id)
      if (empDetail.data.success) {
        networkEmpVo.value = { ...networkEmpVo.value, ...empDetail.data.data.row }
        // 获取自定义字段
        const networkEmpFieldOptions = await networkEmpFieldSelect()
        networkEmpVo.value.fieldVals = networkEmpFieldOptions.data.data.rows.map((item) => {
          item['fieldId'] = item.id
          item.id = null
          return item
        })
        networkEmpVo.value.fieldVals = networkEmpVo.value.fieldVals.map((o) => {
          if (o.type == 5 || o.type == 6 || o.type == 7) {
            o.value = []
            o.imgarr = []
          } else if (o.type == 4) {
            o.value = []
          } else {
            o.value = ''
          }
          empDetail.data.data.row.fieldVals.map((item) => {
            if (o.fieldId == item.fieldId) {
              o.id = item.id
              if (item.type == 5 || item.type == 6 || item.type == 7) {
                let ov = item.optVos.map((vo) => {
                  return { id: vo.id, image: vo.optValue }
                })
                o.imgarr = [...ov]
              } else if (item.type == 4) {
                let ov = item.optVos.map((vo) => vo.optValue)
                o.value = [...ov]
              } else {
                o.value = item.optVos.map((vo) => vo.optValue)[0]
              }
            }
          })
          return o
        })
        networkEmpVo.value.networkId = props.networkId ? props.networkId : ''
        networkEmpVo.value.networkEmpLevelId =
          networkEmpVo.value.networkEmpLevelId == 0 ? null : networkEmpVo.value.networkEmpLevelId
      } else {
        ElMessage({
          showClose: true,
          message: empDetail.data.message,
          type: 'error',
          offset: 200,
        })
      }
    } else {
      networkEmpVo.value = {
        accountId: null,
        accountUserName: '',
        accountUserPhone: '',
        delNetworkIds: [],
        fieldVals: [],
        networkId: props.networkId ? props.networkId : '',
        id: null,
        quit: false,
        superManager: false,
        autoSureReceiveOrder: true,
        networkEmpLevelId: null, //等级ID
        networkEmpSkillIds: [], //工程师技能ID
      }
      await selfDefined()
    }
    getNetworkDetailEmpListDetailLoading.value = false
    CurrentnetworkEmpLevelId.value = networkEmpVo.value.networkEmpLevelId
    if (networkEmpVo.value.manualLevel == null) {
      networkEmpVo.value.manualLevel = false
    }
  }

  // 保存
  async function onSave() {
    if (!formRef.value) return
    formRef.value.validate(async (val) => {
      if (val) {
        let dataSave = _.cloneDeep(networkEmpVo.value)
        // 判断是否有自定义字段文件上传
        if (dataSave.fieldVals.length > 0) {
          for (const key in dataSave.fieldVals) {
            let item = dataSave.fieldVals[key]
            if (item.type == 5 || item.type == 6 || item.type == 7) {
              let img = [] //新上传的
              let isImg = [] //已经上传的
              for (const i in item.imgarr) {
                const it = item.imgarr[i]
                if (it.file) {
                  img.push(it.file)
                } else {
                  isImg.push(it)
                }
              }
              if (img.length > 0) {
                if (item.type == 7) {
                  await orderVideoUpload(img).then((res) => {
                    if (res.data.success) {
                      for (let i = 0; i < res.data.data.rows.length; i++) {
                        item.value.push({ id: null, image: res.data.data.rows[i] })
                      }
                    } else {
                      if (res.data.isError)
                        ElMessage({
                          message: res.data.message,
                          type: 'error',
                        })
                    }
                  })
                } else {
                  await orderAnnexUpload(img).then((res) => {
                    if (res.data.success) {
                      for (let i = 0; i < res.data.data.rows.length; i++) {
                        item.value.push({ id: null, image: res.data.data.rows[i] })
                      }
                    } else {
                      if (res.data.isError)
                        ElMessage({
                          message: res.data.message,
                          type: 'error',
                        })
                    }
                  })
                }
              }
              item.value = [...isImg, ...item.value]
              if (item.type == 5 || item.type == 6 || item.type == 7) {
                item.value = item.value
              }
            }
          }
        }
        dataSave.fieldVals = dataSave.fieldVals.map((item) => {
          let tem = []
          if (item.type === 5 || item.type === 6 || item.type === 7) {
            tem = item.value.map((o) => {
              return { id: o.id, optValue: o.image }
            })
          } else if (item.type === 4) {
            tem = item.value.map((o) => {
              return { id: null, optValue: o }
            })
          } else {
            tem = [{ id: null, optValue: item.value }]
          }
          return { ...item, optVos: tem }
        })
        saveLoading.value = true
        await empSave(dataSave).then((res) => {
          if (res.data.success) {
            ElMessage({
              showClose: true,
              message: res.data.message,
              type: 'success',
              offset: 200,
            })
            emits('update-list') //更新列表
            // getnetworkListRows()
            onCancel()
          } else {
            if (res.data.isError)
              ElMessage({
                showClose: true,
                message: res.data.message,
                type: 'error',
                offset: 200,
              })
          }
          saveLoading.value = false
        })
      } else {
        ElMessage({
          showClose: true,
          message: '请填写完整信息！',
          type: 'warning',
          offset: 200,
        })
      }
    })
  }

  // 获取自定义字段
  const selfDefined = async () => {
    await networkEmpFieldSelect().then((res) => {
      if (res.data.data.rows.length > 0) {
        networkEmpVo.value.fieldVals = res.data.data.rows.map((o) => {
          o.fieldId = o.id
          o.id = null
          if (o.type == 5 || o.type == 6 || o.type == 7) {
            o.value = []
            o.imgarr = []
          } else if (o.type == 4) {
            o.value = []
          } else {
            o.value = ''
          }
          return o
        })
      }
    })
  }
  // 添加图片
  const handleChange2 = (uploadFile: UploadFile, item) => {
    if (item.uploadSize < uploadFile.size / 1024 / 1024) {
      ElMessage({
        showClose: true,
        message:
          item.type == 5
            ? '图片'
            : item.type == 6
            ? '附件'
            : '视频' + '大小不能超过' + item.uploadSize + 'MB!',
        type: 'error',
        duration: 2000,
      })
      return
    }
    if (item.imgarr.length >= item.uploadQty) {
      ElMessage({
        showClose: true,
        message: `${item.type == 5 ? '图片' : item.type == 6 ? '附件' : '视频'} 数量不能超过 ${
          item.uploadQty
        }!`,
        type: 'error',
        duration: 2000,
      })
      return
    }
    let { uid, name } = uploadFile.raw
    let tmp = {
      uid,
      name,
      image: window.URL.createObjectURL(uploadFile.raw),
      file: uploadFile.raw,
    }
    item.imgarr.push(tmp)
  }
  // 删除图片
  const deleteItem2 = (bigindex, index) => {
    networkEmpVo.value.fieldVals = networkEmpVo.value.fieldVals.map((arr, j) => {
      if ((arr.type == 5 || arr.type == 6 || arr.type == 7) && j == bigindex) {
        arr.imgarr = arr.imgarr.filter((o, i) => i != index)
      }
      return arr
    })
  }
  // 查看图片
  const isPdf = ref()
  const file = ref(null)
  const dialogContract = ref(false)
  const lookFile = (val, tem) => {
    file.value = val
    dialogContract.value = true
    isPdf.value = tem
  }
  //监听弹窗关闭时销毁 iframe内存
  watch(dialogContract, (n) => {
    if (!n) {
      file.value = 'about:blank'
    }
  })
  // 获取工程师等级
  const networkEmpLevelList = ref([])
  const getNetworkEmpPageSelectListLoading = ref(false)
  const getNetworkEmpPageSelectList = _.throttle(async (val: string) => {
    getNetworkEmpPageSelectListLoading.value = true
    const data = {
      limit: 0,
      name: val,
      page: 0,
    }
    const res = await getNetworkEmpLevelSelect(data)
    networkEmpLevelList.value = res.data.data.rows
    getNetworkEmpPageSelectListLoading.value = false
  }, 500)

  // 手动等级/自动等级：恢复原本值
  const radiodian = (val: boolean) => {
    if (!val) {
      networkEmpVo.value.networkEmpLevelId = CurrentnetworkEmpLevelId.value
    }
  }

  // 获取工程师技能
  const networkEmpSkillList = ref([])
  const getNetworkSkillPageSelectListLoading = ref(false)
  const getNetworkSkillPageSelectList = _.throttle(async (val: string) => {
    getNetworkSkillPageSelectListLoading.value = true
    const data = {
      limit: 0,
      name: val,
      page: 0,
    }
    const res = await getNetworkEmpSkillSelect(data)
    networkEmpSkillList.value = res.data.data.rows
    getNetworkSkillPageSelectListLoading.value = false
  }, 500)

  //获取服务商下拉
  const networks = ref<Array<NetworkOptions>>([])
  const getNetworkPageSelectList = async (query: string) => {
    const data = {
      limit: 0,
      name: query,
      page: 0,
    }
    const res = await getNetworkPageSelect(data)
    if (res.data.success) {
      networks.value = res.data.data.rows
    }
  }
  const searchNetworks = ref('')

  // 删除加载
  const delLoading = ref(false)

  // 删除员工
  function btnDelete() {
    ElMessageBox.confirm('是否删除服务商人员', '删除', {
      cancelButtonText: '取消',
      confirmButtonText: '确认',
      type: 'warning',
      autofocus: false,
    }).then(() => {
      delLoading.value = true
      deleteNetworkEmp(empRelationId.value).then((res) => {
        if (res.data.success) {
          ElMessage({
            showClose: true,
            message: res.data.message,
            type: 'success',
            offset: 200,
          })
          emits('update-list') //更新列表
          // getnetworkListRows()
          onCancel()
        } else {
          if (res.data.isError)
            ElMessage({
              showClose: true,
              message: res.data.message,
              type: 'error',
              offset: 200,
            })
        }
        delLoading.value = false
      })
    })
  }

  /**
   * 关闭弹窗事件
   */
  const onCancel = () => {
    formRef.value.resetFields()
    visible.value = false
    resetFormValidateResult()
    emits('update:modelValue', visible.value)
    emits('assign-dialog')
  }

  // 弹窗的显示状态
  const visible = ref(false)

  watch(searchNetworks, (n) => {
    getNetworkPageSelectList(n)
  })

  watch(assignDialog, (value) => {
    if (value) {
      editDialogShow(isAdd.value, empInfo.value)
    }
  })
</script>
<style lang="scss" scoped>
  @import './selfscss';
</style>
